<template>
  <el-menu default-active="2" class="el-menu-vertical-demo">
    <el-menu-item index="article" @click="onMenuItemClick">
      <el-icon>
        <List />
      </el-icon>
      <span>文章</span>
    </el-menu-item>
    <el-menu-item index="edit" @click="onMenuItemClick">
      <el-icon>
        <Edit />
      </el-icon>
      <span>编辑器</span>
    </el-menu-item>
  </el-menu>
</template>

<script setup>
import { useRouter } from 'vue-router'

const router = useRouter()
const onMenuItemClick = ({ index = '' }) => {
  if (index === 'article') {
    router.push({ path: '/home/article' })
  } else if (index === 'edit') {
    router.push({ path: '/home/editor' })
  }
}
</script>

<style scoped>
.el-menu-vertical-demo {
  height: calc(100vh - 60px);
}
</style>
